<template>
  <div class="jobs">
    <el-card shadow="hover">
      <div slot="header">
        <el-button size="small" type="primary" @click="getJobs" icon="el-icon-refresh">刷新</el-button>
        <el-button size="small" type="success" plain icon="el-icon-plus" @click="openAddJobDialog">发布工作</el-button>
      </div>
      <el-table :data="jobs" empty-text="暂无工作..." border v-loading="loading">
        <el-table-column type="index" width="60" align="center"/>
        <el-table-column prop="title" label="工作信息"/>
        <el-table-column prop="salary" label="报酬"/>
        <el-table-column label="公司名称">
          <template slot-scope="scope">
            <span>{{scope.row.company.name}}</span>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <el-popconfirm
              title="确定申请该工作吗？"
              @confirm="applyJob(scope.row.jobId)"
            >
              <!--              <el-button type="text" :disabled="userInfo.address == scope.row.employerAddress" >申请工作</el-button>-->
              <el-button slot="reference" type="text">申请工作</el-button>
            </el-popconfirm>

            <!--            <el-button type="text" :disabled="userInfo.address != scope.row.employerAddress" @click="delJob()">删除</el-button>-->
          </template>
        </el-table-column>
      </el-table>
    </el-card>



    <!--添加工作弹窗-->
    <PushJob  :addJobShow="addJobShow" @close="addJobShow=false" @success="getJobs"/>

    <!--注册公司弹窗-->
    <AddCompany  :addCompanyShow="addCompanyShow" @close="addCompanyShow=false" @success="getCompanys"/>

    <!--注册学生弹窗-->
    <AddStudent :userInfo="userInfo" :addStudentShow="addStudentShow" @close="addStudentShow=false"/>

  </div>
</template>
<script>
import {
  getJobsApi, getCompanysApi,
  getCompanyInfoApi, applyJobApi, getStudentInfoApi,
} from '@/api/qingongjianxue'
import PushJob from "./PushJob.vue";
import AddCompany from "./AddCompany.vue";
import AddStudent from "./AddStudent.vue";

export default {
  name: 'AllJobs',
  components: {PushJob, AddCompany, AddStudent},
  computed: {
    userInfo(){
      return this.$store.state.app.user_info
    }
  },

  data() {
    return {
      jobs: [],
      loading: false,
      companys: [], //公司列表
      addJobShow: false,
      addCompanyShow: false,
      addStudentShow: false
    }
  },
  methods: {
    //申请工作
    async applyJob(jobId){
      const studenInfo = await getStudentInfoApi(this.userInfo.address)
      if(studenInfo.data.value1 === '0x0000000000000000000000000000000000000000'){
        this.$confirm('请先注册成学生!', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          callback: async (action) => {
            if(action === 'confirm'){
              this.addStudentShow = true
            }
          }
        });
      }else{
        const params = {
          jobId,
          privateKey: this.userInfo.privateKey
        }
        await applyJobApi(params)
        this.$message.success('申请成功! 请等待审核。')
        this.getJobs()
      }
    },

    //打开发布工作弹窗
    async openAddJobDialog(){
      try{
        await getCompanyInfoApi(this.userInfo.address)
        this.addJobShow = true
      }catch (e){
        this.$confirm('您暂无公司，是否创建?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          callback: async (action) => {
            if(action === 'confirm'){
              this.addCompanyShow = true
            }
          }
        });
      }
    },
    //获取所有公司列表
    async getCompanys(){
      try {
        const res = await getCompanysApi()
        if(res.code === 200) {
          this.companys = res.data
        } else {
          this.$message.error('获取公司列表失败: ' + (res.msg || '未知错误'))
        }
      } catch (error) {
        console.error('合约调用错误:', error)
        this.$message.error('获取公司列表失败: ' + (error.message || '合约调用异常'))
      }
    },

    //获取工作列表
    async getJobs(){
      this.loading = true
      try{
        const res = await getJobsApi()
        for(const job of res.data){
          const depr = await getCompanyInfoApi(job.employerAddress)
          job.company = {
            name: depr.data.value2,
            address: depr.data.value1
          }
        }
        this.jobs = res.data
      }catch (e){
        console.log(e)
      }finally {
        this.loading = false
      }
    },

  },
  async mounted() {
    await this.getCompanys()
    await this.getJobs()
  }
}
</script>
<style scoped lang="scss">

</style>
